<template>
  <el-row style="height: 100%">
    <el-col :span="6" class="padding">
      <div class="padding border" style="height: 86vh; box-sizing: border-box">
        <div class="text-block border-bottom">
          <strong><i class="fa fa-inbox"></i> 系统参数：</strong>
          <span class="badge bg-orange pull-right">1</span>
        </div>
        <div class="text-block border-bottom">
          <strong><i class="fa fa-envelope-o"></i> 服务端口：</strong>
          <span class="badge bg-orange pull-right">4</span>
        </div>
        <div class="text-block border-bottom">
          <strong><i class="fa fa-file-text-o"></i> Drafts：</strong>
          <span class="badge bg-gray pull-right">32</span>
        </div>
        <div class="text-block border-bottom">
          <strong><i class="fa fa-filter"></i> Junk：</strong>
          <span class="badge bg-gray pull-right">1</span>
        </div>
        <div class="text-block border-bottom">
          <strong><i class="fa fa-trash-o"></i> Trash：</strong>
          <span class="badge bg-gray pull-right">2</span>
        </div>
      </div>
    </el-col>
    <el-col :span="18" class="padding">
      <div class="flex-box border" style="height: 86vh">
        <div class="flex-header border-bottom">
          <sea-table-title slot="header" title="系统参数"></sea-table-title>
        </div>
        <div class="flex-body">
          <code-editor-props style="height: 100%"></code-editor-props>
        </div>
        <div class="flex-footer">
          <div class="pull-right">
            <el-button><i class="fa fa-fw fa-refresh"></i>重置</el-button>
            <el-button type="primary"><i class="fa fa-fw fa-upload"></i>保存</el-button>
          </div>
          <div class="clearfix"></div>
        </div>
      </div>

    </el-col>
  </el-row>
</template>

<script>
import CodeEditorProps from "@/widget/form-item/code-editor-props.vue";

export default {
  name: "compose",
  components: {CodeEditorProps},
  data() {
    return {}
  }
}
</script>

<style scoped>
</style>
